<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>发布</title>
     <script src="/static/js/jquery-1.11.3.min.js"></script>
    <script src="/static/js/layui.js"></script>
    <link rel="stylesheet" href="/static/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/css/normalize.css">
    <link rel="stylesheet" href="/static/css/layui.css">
    <link rel="stylesheet" href="/static/css/layui.mobile.css">
	<style>
		@font-face {font-family: "iconfont";
        src: url('/static/css/iconfont.eot?t=1490147664686'); /* IE9*/
        src: url('/static/css/iconfont.eot?t=1490147664686#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('/static/css/iconfont.woff?t=1490147664686') format('woff'), /* chrome, firefox */
        url('/static/css/iconfont.ttf?t=1490147664686') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
        url('/static/css/iconfont.svg?t=1490147664686#iconfont') format('svg'); /* iOS 4.1- */
      }

		.iconfont {
		font-family:"iconfont" !important;
		font-size:16px;
		font-style:normal;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		}
		#containter{width:100%;margin:0 auto;min-width:300px;max-width:420px;padding:0 10px 0 10px;}
		#body{margin:10px 0 0 0;width:100%;float:left;}
		#title{width:96%;height:80px;font-size:16px;margin:0 auto;border-color:rgb(228,226,229);background:rgb(246,248,249);}
		#title_num,#content_num{float:right;padding:10px;}
		#content{width:96%;height:160px;font-size:16px;margin:0 auto;border-color:rgb(228,226,229);background:rgb(246,248,249);}
		.mis{clear:both;}
		.qkind{width:100%;margin-top:10px;padding-bottom:10px;float:left;}
		.qkind_title{font-size:16px;color:#333;font-family:"微软雅黑";margin:0 0 10px 0;}
		.qkind_select{width:110px;height:32px;border-radius:3px;border:2px solid #ccc;position:relative;float:left;margin:10px 0 0 10px;}
		.qkind_select>span{font-size:20px;color:rgb(113,116,119);display:block;text-align:center;margin:0 auto;}
		.qkind_q{position:absolute;background:#ccc;font-size:9px;color:#fff;display:block;width:10px;height:10px;right:0;}
		.submit{margin-top:20px;}
		.tag{width:110px;height: 30px;}
	</style>
</head>
<body>
	<section id="containter">
		<section id="body">
			<form action="#" method="post" id="edit_form">
			{:token()}
				<label for="title">标题：</label>
				<textarea name="title" id="title" class="form-control" maxlength="60" >11
				</textarea>
				<div id="title_num">
					<span>0</span>
					<span>/</span>
					<span>60</span>
				</div>
				<div class="mis"></div>
				<label for="content">内容：</label>
				<textarea name="content" id="content" class="form-control" maxlength="256" >
				</textarea>
				<div id="content_num">
					<span>0</span>
					<span>/</span>
					<span>256</span>
				</div>

				<input type="hidden" val="" name="category" id="hid">
				<div class="mis"></div>
				<div class="qkind">
					<div class="qkind_title">选择分类(必选)</div>

					{foreach $category as $vo}
						<div class="qkind_select">
							<input type="hidden" value="{$vo.id}" class="qkind_s">
							<i class="iconfont qkind_q">&#xe607;</i>
							<span>{$vo.name}</span>
						</div>
					{/foreach}
					<div class="qkind_select">
						<i class="iconfont qkind_q">&#xe607;</i>
							<span><input type="text" name='tag'  value="自定义标签" class='tag'></span>
					</div>

				</div>
			</form>

			<div class="mis"></div>
			<button class="submit btn btn-primary btn-lg btn-block btn-warning" type="submit" type="button" form="edit_form">发布</button>
		</section>

	</section>
</body>
<script>
	$('#title').val("{$tips['title']}");
	$('#content').val("{$tips['content']}");
	$('#title').click(function(event) {
		if($('#title').val() =="{$tips['title']}"){
			$('#title').val('');
		}
	});
	$('#content').click(function(event) {
		if($('#content').val() == "{$tips['content']}"){
			$('#content').val('');
		}
	});
	setInterval(function(){
		$len = $("#title").val().length;
		$("#title_num>span:eq(0)").html($len);
	},100);

	setInterval(function(){
		$len = $("#content").val().length;
		$("#content_num>span:eq(0)").html($len);
	},100);


	$(".qkind_select").on("click",function(){
		$(".qkind_select").css("border","2px solid #ccc");
		$(".qkind_select").find(".qkind_q").css("background","#ccc");
		$(this).css("border","2px solid rgb(237,148,57)");
		$(this).find(".qkind_q").css("background","rgb(237,148,57)");
		$res = $(this).find("input[type=hidden]").val();
		//$("#hid").val("");
		$("#hid").val($res);
	});
	$(".tag").on("click",function(){
		$(this).val('');
	});
	$(".tag").on("input",function(){
		$("#hid").val(-1);
	});

	$('.submit').click(function(e) {
		e.preventDefault();
		if($("#title").val() ==''){
			alert('标题不能为空');
			return false;
		}
		if($("#content").val() ==''){
			alert('内容不能为空');
			return false;
		}
		if($("#hid").val() ==''){
			alert('必须选择分类');
			return false;
		}
		//$('.submit').attr('disabled',"true");
		$.post("",$("#edit_form").serialize(),function(data){
			if(data.code > 0){
				alert(data.message);
				location.href = "{:url('detail')}/id/" + data.code + '.html';
			}else{
				alert(data.message);
			}
   		});
	});



</script>
</html>